<template>
    <div class="datacenter">
         <el-tabs v-model="tabsValue" tab-position="left" style="width: 10%;" ><!-- @tab-click="handleClick" -->
            <el-tab-pane label="会员中心" name="member"></el-tab-pane>
            <el-tab-pane label="人脸特征值" name="memberFace"></el-tab-pane>
            <el-tab-pane label="客流数据" name="index"></el-tab-pane>
        </el-tabs>

        <keep-alive >
            <component :is="pageName"/>
        </keep-alive>
  
    </div>
</template>

<script>

import member from '@/views/datacenter/member/member'
import memberFace from '@/views/datacenter/member/memberFace'
import index from '@/views/datacenter/member/index'

export default {
    name: "datacenter",
    data() {
        return {
            tabsValue : 'index'
        };
    },
    components: {member, memberFace, index},
    created() {
    },
    mounted(){
    },
    computed: {
        pageName() {
            return this.tabsValue
        }
    },
    methods: {
    }
};
</script>
<style lang="scss" scoped>
.datacenter {
    display: flex;
}
.datacenter /deep/ .el-tabs--left .el-tabs__header.is-left {
    position: fixed;
}
</style>